<template>
  <div class="home-container fadeIn">
    <div class='home-content'>
      <div class="">
        <el-form :model='formAdd'  status-icon ref='formAdd' label-width='100px' size="medium">
          <!-- <div class='item-box'>
            <el-form-item prop='apkUrl' label="apkUrl：" >
              <el-input type='text' v-model='formAdd.apkUrl' placeholder='请输入apkUrl' auto-complete='off'/>
            </el-form-item>
          </div> -->
          <div class='item-box'>
            <el-form-item prop='appName' label="应用名称：" >
              <el-input type='text' v-model='formAdd.appName' placeholder='请输入应用名称' auto-complete='off'/>
            </el-form-item>
          </div>
          <div class='item-box'>
            <el-form-item prop='packageName' label="应用包名：" >
              <el-input type='text' v-model='formAdd.packageName' placeholder='请输入应用包名' auto-complete='off'/>
            </el-form-item>
          </div>
          <div class='item-box'>
            <el-form-item prop='appDescribe' label="应用描述：" >
              <el-input  v-model='formAdd.appDescribe' placeholder='请输入应用描述' type="textarea"  :rows="5" auto-complete='off' />
            </el-form-item>
          </div>
          <div class='item-box'>
            <el-form-item prop='appType' label="应用类型：" >
              <el-select v-model="formAdd.appType" placeholder="请选择">
                <el-option
                  v-for="item in options"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value">
                </el-option>
              </el-select>
            </el-form-item>
          </div>

          <div class='item-box'>
            <el-form-item>
              <el-button class='submit' type="primary" @click='onSubmit'>保存</el-button>
            </el-form-item>
          </div>
        </el-form>
      </div>
    </div>
  </div>

</template>

<script>
import { mapActions } from 'vuex';
import { queryString } from '@/utils';

export default {
  name: 'HomeChild',
  data() {
    return {
      formAdd: {
        appName: '',
        appType: '',
        appDescribe: '',
        packageName: '',
        apkUrl: '',
        userId: this.$getLS('userId'),
        id: '',
      },
      options: [{
        value: '1',
        label: '1.游戏',
      }, {
        value: '2',
        label: '2.应用',
      }],
      isSubmit: false,
    };
  },
  computed: {
  },
  mounted() {
    if (this.$route.query) {
      this.formAdd = {
        appName: this.$route.query.appName,
        appType: this.$route.query.appType,
        appDescribe: this.$route.query.appDescribe,
        packageName: this.$route.query.packageName,
        userId: this.$getLS('userId'),
        id: this.$route.query.id,
      };
    }
  },
  components: {
  },
  methods: {
    ...mapActions('homeOperate', [
      'save',
    ]),
    onSubmit() {
      this.$refs.formAdd.validate((valid) => {
        if (valid && !this.isSubmit) {
          // 用户注册  baseURL
          return this.save(queryString(this.formAdd))
          .then((res) => {
            setTimeout(() => {
              this.isSubmit = false;
            }, 5000);
            if (res.data === true) {
              this.$router.push({ path: '/main/homeOperate' });
            } else {
              this.$message.warning('操作失败！');
            }
          });
        }
        return false;
      });
    },

  },
};
</script>

<style lang='scss' src='@/scss/pages/home_index.scss'/>
<style lang='scss' scope src='@/scss/pages/child.scss'/>
